<template>
	<page-meta><navigation-bar title="策略订阅" front-color="#000000" background-color="#ffffff" /></page-meta>
	<view :style="{ 'min-height': height + 'px' }" style="background: #f7f7f7;">
		<view class="top">
			<view :class="{ active: nowid == index }" @tap="taptap(index)" v-for="(i, index) in scrooldata" :key="index">
				<text>{{ i.name }}</text>
			</view>
		</view>
		<swiper
			:indicator-dots="false"
			@change="change"
			:style="{ height: scrooldata[nowid].height + 'px' }"
			style="margin-top: 40px;background: #f7f7f7;"
			:autoplay="false"
			:current="nowid"
			:interval="500"
			:duration="200"
		>
			<swiper-item>
				<view class="dingyue" style="overflow: hidden;">
					<view @tap="open(i)" v-for="i,index in dingyue" style="width: calc(100% - 70px);position: relative; margin: 0 auto;background: #fff;border-radius:6px;margin-top: 15px;padding: 15px 20px;">
						<view style="padding-bottom: 5px;font-size: 18px;font-weight: 500;">word</view>
						<view style="padding-bottom: 5px;font-size: 14px;color: rgba(0,0,0,.6);font-size: 15px;">Q219237366 -> 吴大爷</view>
						<view style="font-size: 12px;color: rgba(0,0,0,.6);padding-bottom: 5px;">
							<text>col2010</text>
							<text style="padding-left: 8px;">反向</text>
							<text style="padding-left: 8px;">1-2-2-2</text>
							<text style="float: right;position: absolute;right: 15px;font-size: 14px; top: 50%;transform: translateY(-50%); font-size: 16px;margin-bottom: 240rpx;display: inline-block;" :style="{color:i.state == 1?'#4680b0':'#ccc'}">{{i.state == 1?'正常':'关闭'}}</text>
						</view>
						<view style="font-size: 14px;color: rgba(0,0,0,.6);">盈利2笔</view>
					</view>
					<uni-text v-if="!dingyue.length" style="height: 400x;font-size: 16px;text-align: center;display: block;color: red;padding-top: 150px;">
						暂无订阅信息！
						<!-- <navigator url="../center/setshi" style="color:#168deb ;display: inline-block;">去添加</navigator> -->
					</uni-text>
				</view>
			</swiper-item>
			<swiper-item>
				<view class="dingyue1">
					<view style="width: calc(100% - 40px);position: relative; margin: 0 auto;background: #fff;border-radius: 6px;margin-top: 15px;padding: 15px 10px;">
						<view style="padding-bottom: 5px;font-size: 18px;font-weight: 500;">word</view>
						<view style="padding-bottom: 5px;font-size: 14px;color: rgba(0,0,0,.6);font-size: 15px;">Q219237366 -> 吴大爷</view>
						<view style="font-size: 12px;color: rgba(0,0,0,.6);padding-bottom: 5px;">
							<text>col2010</text>
							<text style="padding-left: 8px;">反向</text>
							<text style="padding-left: 8px;">1-2-2-2</text>
							<text style="float: right;position: absolute;right: 15px;font-size: 14px; top: 30%;font-size: 16px;margin-bottom: 240rpx;display: inline-block; color: red;">已删除</text>
						</view>
						<view style="font-size: 14px;color: rgba(0,0,0,.6);padding-bottom: 5px;">盈利2笔</view>
						<view style="font-size: 10px;color: rgba(0,0,0,.6);">添加时间：2016-12-12 12:12:12
						<text style="float: right;">删除时间：2016-12-12 12:12:12</text>
						</view>
					</view>
					<uni-text v-if="!lishid.length" style="height: 400x;font-size: 16px;text-align: center;display: block;color: red;padding-top: 150px;">
						暂无历史订阅信息！
						<!-- <navigator url="../center/setshi" style="color:#168deb ;display: inline-block;">去添加</navigator> -->
					</uni-text>
				</view>
			</swiper-item>
		</swiper>
		<uni-popup type="bottom" ref="settypes">
			<view style="background: #fff;padding: 20px 25px;">
				<button type="default" v-if="nowobj.state == 1" style="background: #168deb;color: #fff;margin-bottom: 10px;" @tap="shilogin(0)">关闭</button>
				<button type="default" v-else style="background: #168deb;color: #fff;margin-bottom: 10px;" @tap="shilogin(1)">开启</button>
				<button type="default" style="color: red;" @tap="shilogin(3)">删除</button>
			</view>
		</uni-popup>
	</view>
</template>

<script>
export default {
	data() {
		return {
			height: '',
			nowid: 0,
			scrooldata: [{ name: '订阅跟单', height: 500 }, { name: '历史跟单', height: 500 }],
			nowobj: {},
			dingyue: [],
			lishid: []
		};
	},
	methods: {
		shilogin(type){
			var _this = this;
			uni.request({
				url: _this.$store.state.url1 + '/api/FollowSetting/EditSheQuAppRATIOFollow?token=' + this.$store.state.user.token+'&id='+_this.nowobj.id+'&state='+type,
				method: 'get',
				// data: _this.param,
				success: res => {
					console.log(res);
					res = res.data;
					
					if (res.code == 200) {
						if(type == 1){
							uni.showToast({
								title: '已开启！',
								duration: 1500
							});
							_this.nowobj.state = 1;
						}else if(type == 0){
							uni.showToast({
								title: '已关闭！',
								duration: 1500
							});
							_this.nowobj.state = 0;
						}else{
							uni.showToast({
								title: '已删除！',
								duration: 1500
							});
							for(var i in _this.dingyue){
								if(_this.dingyue[i].accountNo == _this.nowobj.accountNo && _this.dingyue[i].nickName == _this.nowobj.nickName){
									_this.dingyue.splice(i,1);
								}
							};
							
							setTimeout(function(){
								let view = uni.createSelectorQuery().select('.dingyue');
								view.fields(
									{
										size: true,
										rect: true,
										scrollOffset: true
									},
									res => {
										console.log(res.height)
										if(res.height<400) res.height = 400;
										_this.scrooldata[0].height = res.height +25;
									}
								).exec();
							},300)
						}
						_this.close()
					} else {
						
					}
				},
				fail: res => {
					console.log(res);
				}
			});
		},
		open(obj) {
			this.$refs.settypes.open();
			this.nowobj = obj;
		},
		close() {
			this.$refs.settypes.close();
		},
		change(e, type) {
			this.nowid = e.detail.current;
			// console.log(e.detail.current)
		},
		taptap(id) {
			this.nowid = id;
		},
		getdata() {
			this.getdy();
			this.getls();
		},
		getdy() {
			var _this = this;
			uni.request({
				url: _this.$store.state.url1 + '/api/FollowSetting/GetFollowingList?token=' + this.$store.state.user.token,
				method: 'get',
				// data: _this.param,
				success: res => {
					// console.log(res)
					res = res.data;
					// console.log(res);
					// console.log(_this.searchdata)
					if (res.code == 200) {
						_this.dingyue = res.data;
						setTimeout(function(){
							let view = uni.createSelectorQuery().select('.dingyue');
							view.fields(
								{
									size: true,
									rect: true,
									scrollOffset: true
								},
								res => {
									// console.log(res.height)
									if(res.height<400) res.height = 400;
									_this.scrooldata[0].height = res.height;
									// console.log(_this.scrooldata[0])
								}
							).exec();
						},300)
					} else {
						
					}
				},
				fail: res => {
					console.log(res);
				}
			});
		},
		getls() {
			var _this = this;
			uni.request({
				url: _this.$store.state.url1 + '/api/FollowSetting/GetHistoryFollowingList?token=' + this.$store.state.user.token,
				method: 'get',
				// data: _this.param,
				success: res => {
					res = res.data;
					// console.log(res);
					// console.log(_this.searchdata)
					if (res.code == 200) {
						_this.lishid = res.data;
						setTimeout(function(){
							let view = uni.createSelectorQuery().select('.dingyue1');
							view.fields(
								{
									size: true,
									rect: true,
									scrollOffset: true
								},
								res => {
									// console.log(res.height)
									if(res.height<400) res.height = 400;
									_this.scrooldata[0].height = res.height +25;
								}
							).exec();
						},300)
					} else {
						
					}
				},
				fail: res => {
					console.log(res);
				}
			});
		}
	},
	onShow() {
		this.height = uni.getSystemInfoSync().windowHeight-40;
		var _this = this;
		uni.getNetworkType({
			success: function(res) {
				if (res.networkType == 'none') {
					uni.showToast({
						title: '当前无网络连接，请检查！',
						icon: 'none',
						duration: 5000

						// position:'top'
					});
				}
			}
		});
		uni.onNetworkStatusChange(function(res) {
			if (!res.isConnected) {
				uni.showToast({
					title: '当前无网络连接，请检查！',
					icon: 'none',
					duration: 3000
					// position:'top'
				});
			} else {
				uni.showToast({
					title: '网络已连接！',
					icon: 'none',
					duration: 3000
					// position:'top'
				});
				_this.getdata();
			}
		});
		if (_this.setdata) {
			for (var i in _this.setdata) {
				var is = _this.setdata[i];
				_this.shisetdata[i] = is;
			}
		}
		this.getdata();
	},
	onLoad(e) {
		if(e.type){
			this.nowid = 1;
		}
	}
};
</script>

<style scoped>
.top {
	position: fixed;
	z-index: 10;
	width: 100%;
	left: 0;
	top: 0;
	display: flex;
	flex-direction: row;
	background: #fff;
}
.top > uni-view {
	flex: 1;
	text-align: center;
	line-height: 40px;
	height: 40px;
}
.top > uni-view * {
	height: 40px;

	display: inline-block;
}
.top > uni-view.active * {
	border-bottom: 2px solid #4481ae;
	color: #4481ae;
}
</style>
